<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script src="/cricketplus/misc/jquery.js" type="text/javascript"></script>

<style>
body{margin:0; padding:0; font-size:100%;   }
h1,h2,h3{margin:0;}

select,
input{width:30px; padding:2px; color:#000; border:1px solid #CCC; }
.fielder,
.bowler,
.out{width: 100px; }
.fielder{display:none}
#number{ display:none; } 
#player{width:70px; }
#overbyover{width:90%;}
.total,
.strike_rate{width:50px; }
.scored_on_paper{width:300px; }
thead td{border-bottom:2px solid #CCC; background:#CCC; font-weight:bold;  }
td{padding:4px; border-bottom:1px solid #CCC; }
</style>
</head>

<body>


<h2>Scoresheet - Bowling</h2>
<table width="100%" border="1">
  <tr>
    <td width="5%">&nbsp;</td>
    <td width="6%">Bowler</td>
    <td width="55%">Over By Over Detail</td>
    <td width="4%">Overs</td>
    <td width="4%">Total Runs</td>
    <td width="8%">Wides</td>
    <td width="4%">No Balls</td>
    <td width="6%">Wickets</td>
    <td width="6%">Economy</td>
    <td width="1%">&nbsp;</td>
    <td width="1%">&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td><input type="text" name="player2" id="player2" /></td>
    <td><label>
      <input type="text" name="overbyover" id="overbyover" />
    </label></td>
    <td><input type="text" name="player3" id="player3" /></td>
    <td><input type="text" name="player6" id="player6" />    </td>
    <td><input type="text" name="player4" id="player4" /></td>
    <td><input type="text" name="player5" id="player5" /></td>
    <td><input type="text" name="player7" id="player7" /></td>
    <td><input type="text" name="player8" id="player8" /></td>
    <td>&nbsp;</td>
    <td><label></label></td>
  </tr>
</table>
<h2>&nbsp;</h2>
<h2>&nbsp;</h2>
<h2>Scoresheet - Batting</h2>
<form id="form1" name="form1" method="post" action="">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
   <thead>
    <tr>
      <td width="3%" align="center" valign="middle">#</td>
      <td width="7%"><strong>Player</strong></td>
      <td width="33%"><strong>Scored On Paper</strong></td>
      <td width="4%"><strong>Mins</strong></td>
      <td width="4%"><strong>Balls</strong></td>
      <td width="4%">Dots</td>
      <td width="4%" nowrap="nowrap">1s</td>
      <td width="4%" nowrap="nowrap">2s</td>
      <td width="4%" nowrap="nowrap">3s</td>
      <td width="2%" nowrap="nowrap"><strong>4s</strong></td>
      <td width="2%" nowrap="nowrap"><strong>6s</strong></td>
      <td width="8%" nowrap="nowrap"><strong>Strike Rate</strong></td>
      <td width="5%"><strong>Total</strong></td>
      <td width="9%" nowrap="nowrap">Out</td>
      <td width="19%">Bowler</td>
    </tr>
    </thead>
   <?PHP for($i=1; $i<=11; $i++){
    ?> 
   
    <tr>
      <td align="center" valign="middle"><?PHP print $i; ?>      </td>
      <td><input type="text" name="player" id="player" /></td>
      <td nowrap="nowrap"><label> 
       <input type="hidden"  name="number" id="number" value="<?PHP print $i; ?>" />
        <input type="text" name="scored_on_paper" class="scored_on_paper" id="scored_on_paper_<?PHP print $i; ?>" />
        <input type="button" name="button" id="button" value="&gt;&gt;" onclick="calulate_score(<?PHP print $i; ?>)" />
      </label></td>
      <td><label>
        <input type="text" name="minutes" id="minutes_<?PHP print $i; ?>" />
      </label></td>
      <td><label>
        <input type="text" name="balls_faced" id="balls_faced_<?PHP print $i; ?>" />
      </label></td>
      <td><label>
        <input type="text" name="dots" id="dots_<?PHP print $i; ?>" />
      </label></td>
      <td><label>
        <input type="text" name="ones" id="ones_<?PHP print $i; ?>" />
      </label></td>
      <td><input type="text" name="twos" id="twos_<?PHP print $i; ?>" /></td>
      <td><input type="text" name="threes" id="threes_<?PHP print $i; ?>" /></td>
      <td><input type="text" name="fours" id="fours_<?PHP print $i; ?>" /></td>
      <td><input type="text" name="sixes" id="sixes_<?PHP print $i; ?>" /></td>
      <td><input type="text" name="strike_rate" class="strike_rate" id="strike_rate_<?PHP print $i; ?>" /></td>
      <td><label>
        <input type="text" name="total" class="total" id="total_<?PHP print $i; ?>" />
      </label></td> 
      <td nowrap="nowrap">
      
      <label>
        <select name="out" class="out" id="out_<?PHP print $i; ?>">
       	<option></option>
       	<option>Not Out</option>
        <option>LBW</option>
        <option>Bowled</option>
        <option>Cought</option>
        <option>Hit Wicket</option>
        <option>Run Out</option>
        <option>DNB</option>
        </select>
       </label>
       
       <select name="field_position" class="fielder" id="position_<?PHP print $i; ?>">
        </select>
        
        <select name="fielder" class="fielder" id="fielder_<?PHP print $i; ?>">
        </select>
        
      </td>
      <td><select name="bowler" id="bowler_<?PHP print $i; ?>">
            </select></td>
    </tr>
    
    <?PHP } ?>
  </table>
</form>
<script type="text/javascript">
String.prototype.count=function(s1) { 
    return (this.length - this.replace(new RegExp(s1,"g"), '').length) / s1.length;
}
/*
$('.scored_on_paper').bind('keypress', function(e) {
 var key = (e.keyCode ? e.keyCode : e.charCode);
 var allowed =new Array(8,46,49,50,51,52,53,54,56);

if( allowed.indexOf(key ) >= 0 ){
  calulate_score($(this));
  }else{
  	return false;
  }
  
});
*/
function calulate_score(id){
	  var score = $("#scored_on_paper_"+ id ).val();
	  id_number =id;
	 
	  bf = score.length ;
	  fours = score.count('4');
	  sixes = score.count('6');
	  dots = score.count('0');
	  ones = score.count('1');
	  twos = score.count('2');
	  threes = score.count('3');
	  fives = score.count('5');
	 alert(dots);

	   total = 0; 
	   total = total + ones * 1; 
	   total = total + (twos * 2); 
	   total = total + (threes * 3); 
	   total = total + (fours * 4); 
	   total = total + (fives  * 5); 
	   total = total + (sixes  * 6);
	  
	   sr = (total / bf) * 100;

	   if(score==""){
	   
	   $("#balls_faced_"+ id_number).val(0);
	   $("#minutes_"+ id_number).val(0 );
	   $("#sixes_"+ id_number).val(0);
	   $("#fours_"+ id_number).val(0);
	   $("#total_"+ id_number).val(0);
	   $("#strike_rate_"+ id_number).val( 0 );
	   
	    $("#ones_"+ id_number).val(0);	   
	   $("#twos_"+ id_number).val(0);
	   $("#threes_"+ id_number).val(0);
	   $("#dots_"+ id_number).val(0);
	   
	   }else{
	   
	   $("#balls_faced_"+ id_number).val(bf);
	   $("#minutes_"+ id_number).val(bf * 1 );
	   $("#sixes_"+ id_number).val(sixes);
	   $("#fours_"+ id_number).val(fours);
	   
	   $("#ones_"+ id_number).val(ones);	   
	   $("#twos_"+ id_number).val(twos);
	   $("#threes_"+ id_number).val(threes);
	   $("#dots_"+ id_number).val(dots);
	   	   
	   $("#total_"+ id_number).val(total);
	   $("#strike_rate_"+ id_number).val( sr.toFixed(2) );
	   }
	    


}


</script>
<p>&nbsp;</p>
</body>
</html>
